﻿/*
配置详情页面
*/
class ConfigureDetailsUI extends UiFramework.UiAbstract
{

    onStart(divSelf: HTMLDivElement)
    {

        //头部div
        var headDiv = document.createElement("div");
        headDiv.style.position = "absolute";
        headDiv.style.width = "100%";
        headDiv.style.height = "7%";
        headDiv.style.lineHeight = "45px";
        headDiv.style.overflow = "hidden";
        this.divSelf.appendChild(headDiv);

        //头部title
        var tit = document.createElement("tit");
        tit.textContent = "配置详情";
        tit.style.height = "100%";
        tit.className = "configurationDetailTit";
        headDiv.appendChild(tit);

        //头部返回按钮
        var btnReturn = document.createElement("img");
        btnReturn.src = "picture/return.png";
        btnReturn.className = "configurationDetailReturn";
        headDiv.appendChild(btnReturn);

        //设备名称DIV
        var eqNameDiv = document.createElement("div");
        eqNameDiv.style.position = "absolute";
        eqNameDiv.style.top = "7%";
        eqNameDiv.style.width = "100%";
        eqNameDiv.style.height = "10%";
        eqNameDiv.style.borderBottom = '1px solid #95989A';
        eqNameDiv.style.background = "#FAF0F0";
        this.divSelf.appendChild(eqNameDiv);


        //设备名称标志
        var eqImage = document.createElement("img");
        eqImage.src = "picture/config_shebei.png";
        eqImage.style.width = "4.5%";
        eqImage.style.height = "25%";
        eqImage.style.paddingTop = "6.5%";
        eqImage.style.paddingLeft = "10%";
        eqNameDiv.appendChild(eqImage);

        //设备名称
        var eqName = document.createElement("eqName");
        eqName.style.position = "absolute";
        eqName.style.left = "25%";
        eqName.textContent = "设备001";
        eqName.style.lineHeight = "61px";
        eqNameDiv.appendChild(eqName);

        //设备所在位置
        var eqPosition = document.createElement("eqPosition");
        eqPosition.style.position = "absolute";
        eqPosition.style.right = '15%';
        //eqPosition.textContent = "主卧";
        eqPosition.style.lineHeight = "61px";
        eqNameDiv.appendChild(eqPosition);


        //场景配置
        var peizhi = document.createElement("peizhi");
        peizhi.style.top = "19%";
        peizhi.style.position = "absolute";
        peizhi.style.left = "4%";
        peizhi.style.color = "#B1B3B5";
        peizhi.style.fontSize = "10px";
        peizhi.textContent = "场景配置";
        this.divSelf.appendChild(peizhi);

        //卧室场景按钮
        var eqBedroom = document.createElement("div");
        eqBedroom.style.top = "22.5%";
        eqBedroom.className = "configurationDetai";
        //eqBedroom.style.background = "#E4E4E4";  //变换颜色
        this.divSelf.appendChild(eqBedroom);

        //卧室文字
        var eqBedroomText = document.createElement("eqBedroomtext");
        eqBedroomText.className = "configurationDetailText";
        eqBedroomText.textContent = "卧室 √";
        eqBedroom.appendChild(eqBedroomText);

        //卧室图标
        var eqBedroomImage = document.createElement("img");
        eqBedroomImage.src = "picture/config_woshi.png";
        eqBedroomImage.className = "configurationDetailImage";
        eqBedroom.appendChild(eqBedroomImage);



        //厨房场景按钮
        var eqKitchen = document.createElement("div");
        eqKitchen.style.top = "22.5%";
        eqKitchen.style.left = "49.78%";
        eqKitchen.className = "configurationDetai";
        this.divSelf.appendChild(eqKitchen);

        //厨房文字
        var eqKitchenText = document.createElement("eqKitchenText");
        eqKitchenText.className = "configurationDetailText";
        eqKitchenText.textContent = "厨房";
        eqKitchen.appendChild(eqKitchenText);

        //厨房图标
        var eqKitchenImage = document.createElement("img");
        eqKitchenImage.src = "picture/config_chufang.png";
        eqKitchenImage.className = "configurationDetailImage";
        eqKitchen.appendChild(eqKitchenImage);

        //客厅场景按钮
        var eqParlour = document.createElement("div");
        eqParlour.style.top = "50.5%";
        eqParlour.className = "configurationDetai";
        this.divSelf.appendChild(eqParlour);

        //客厅文字
        var eqParlourText = document.createElement("eqParlourText");
        eqParlourText.className = "configurationDetailText";
        eqParlourText.textContent = "客厅";
        eqParlour.appendChild(eqParlourText);

        //客厅图标
        var eqParlourImage = document.createElement("img");
        eqParlourImage.src = "picture/config_keting.png";
        eqParlourImage.className = "configurationDetailImage";
        eqParlour.appendChild(eqParlourImage);


        //卫生间场景按钮
        var eqToilet = document.createElement("div");
        eqToilet.style.top = "50.5%";
        eqToilet.style.left = "49.78%";
        eqToilet.className = "configurationDetai";
        this.divSelf.appendChild(eqToilet);

        //卫生间文字
        var eqToiletText = document.createElement("eqToiletText");
        eqToiletText.className = "configurationDetailText";
        eqToiletText.textContent = "卫生间";
        eqToilet.appendChild(eqToiletText);

        //卫生间客厅图标
        var eqToiletImage = document.createElement("img");
        eqToiletImage.src = "picture/config_weisheng.png";
        eqToiletImage.className = "configurationDetailImage";
        eqToilet.appendChild(eqToiletImage);

        //底部完成按钮
        var ensure = document.createElement("ensure");
        ensure.textContent = "完成";
        ensure.className = "configurationDetailTit";
        ensure.style.paddingBottom = "3.5%";
        ensure.style.paddingTop = "3.5%";
        ensure.style.bottom = '0';
        this.divSelf.appendChild(ensure);


        //返回上一页
        btnReturn.onclick = () =>
        {
            this.finish();
        }


        //点击配置卧室的div
        eqBedroom.onclick = () =>
        {
            this.openDialog("bedroomWindow");
        }

        //点击配置厨房的div
        eqKitchen.onclick = () =>
        {
            this.openDialog("kitchenWindow");
        }

        //点击配置客厅的div
        eqParlour.onclick = () =>
        {
            this.openDialog("drawingRoomWindow");
        }

        //点击配置卫生间的div
        eqToilet.onclick = () =>
        {
            this.openDialog("toiletWindow");
        }


        //点击完成按钮 弹出确认窗口
        ensure.onclick = () =>
        {

            this.openDialog("verifyEquipLocationDialog");
        }


    }

    onEnd()
    {

    }
}

UiMap["configureDetailsUI"] = () =>
{
    return new ConfigureDetailsUI();
}